{% extends 'layouts/list_template.html' %}

{% block list_card_content %}
    <div class="card-header pb-0">
        <div class="row">
            <div class="col-lg-6 col-7">
                <h6>{{ request.user.username }}的方案列表 </h6>
                <p class="text-sm mb-0">
                    <i class="fa fa-check text-info" aria-hidden="true"></i>
                    <span class="font-weight-bold ms-1">30 done</span> this month
                </p>
            </div>
            <div class="col-lg-6 col-5 my-auto text-end">
                <div class="dropdown float-lg-end pe-4">
                    <a class="cursor-pointer" id="dropdownTable" data-bs-toggle="dropdown"
                       aria-expanded="false">
                        <i class="fa fa-ellipsis-v text-secondary"></i>
                    </a>
                    <ul class="dropdown-menu px-2 py-3 ms-sm-n4 ms-n5" aria-labelledby="dropdownTable">
                        <li><a class="dropdown-item border-radius-md" href="{% url 'alternative_detail' -1 %}">新建方案</a>
                        </li>
                        <li><a class="dropdown-item border-radius-md" href="javascript:;">Another
                            action</a></li>
                        <li><a class="dropdown-item border-radius-md" href="javascript:;">Something else
                            here</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="card-body px-0 pb-2">
        <div class="table-responsive">
            <table class="table align-items-center mb-0">
                <thead>
                <tr>
                    <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                        编号
                    </th>
                    <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">
                        名称
                    </th>
                    <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                        创建时间
                    </th>
                    <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                        最近修改时间
                    </th>
                    <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                        描述
                    </th>
                    <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                        操作
                    </th>
                </tr>
                </thead>
                <tbody>
                {% for a in alternatives %}
                    <tr>
                        <td>
                            <div class="d-flex px-3 py-1">
                                <div class="d-flex flex-column justify-content-center">
                                    <h6 class="mb-0 text-sm">{{ a.id }}</h6>
                                </div>
                            </div>
                        </td>
                        <td>
                            <div class="d-flex px-2 py-1">
                                <div class="d-flex flex-column justify-content-center">
                                    <h6 class="mb-0 text-sm">{{ a.name }}</h6>
                                </div>
                            </div>
                        </td>
                        <td class="align-middle text-center text-sm">
                            <span class="text-xs font-weight-bold"> {{ a.create_datetime }} </span>
                        </td>
                        <td class="align-middle text-center">
                            <h6 class="mb-0 text-sm">{{ a.last_update_datetime }}</h6>
                        </td>
                        <td class="align-middle text-center">
                            <h6 class="mb-0 text-sm">{{ a.desc }}</h6>
                        </td>
                        <td class="align-middle text-center">
                            <h6 class="mb-0 text-sm">
                                <a href="{% url 'alternative_detail' a.id %}">
                                    <u>查看</u>
                                </a>
                                &nbsp;
                                <a href="javascript:;">
                                    <u>编辑</u>
                                </a>&nbsp;
                                <a href="javascript:;">
                                    <u>删除</u>
                                </a></h6>
                        </td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
        <br>
    </div>
{% endblock %}